<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogVisible"
    width="80%"
    :before-close="handleClose"
    append-to-body
  >
    <div style="margin-bottom: 20px;">
      <el-steps :space="200" :active="active" finish-status="success" process-status="finish" align-center>
        <el-step title="合并简图"></el-step>
        <el-step title="料牌分捆"></el-step>
        <el-step title="优化断料"></el-step>
        <!-- <el-step title="分配设备"></el-step>
        <el-step title="分配班组"></el-step> -->
        <el-step title="打印"></el-step>
      </el-steps>
    </div>
    
    <!-- 合并简图 -->
    <merge-diagram v-show="active === 0" ref="mergeDiagram" @mergeDiagramData="getMergeDiagramData" />
    <!-- 料牌分捆 -->
    <material-plate-bundling v-show="active === 1" ref="materialPlateBundling" @materialPlateBundlingData="getMaterialPlateBundlingData" />
    <!-- 优化断料 -->
    <optimize-cutting v-show="active === 2" ref="optimizeCutting" @optimizeCuttingData="getOptimizeCuttingData" />
    <!-- 分配设备 -->
    <assign-devices v-show="active === 3" ref="assignDevices" @assignDevicesData="getAssignDevicesData" />
    <!-- 分配班组 -->
    <assign-team v-show="active === 4" ref="assignTeam" @assignTeamData="getAssignTeamData" />
    <!-- 打印 -->
    <print v-show="active === 5" ref="print" @printData="getPrintData" />

    <span slot="footer">
      <el-button @click="dialogVisible = false">取消</el-button>
      <el-button v-if="active !== 0" @click="previousStep">上一步</el-button>
      <el-button v-if="active !== 5" type="primary" @click="nextStep">下一步</el-button>
      <el-button v-if="active === 5" type="primary" @click="submitForm">完成</el-button>
    </span>
  </el-dialog>
</template>

<script>
import mergeDiagram from './merge-diagram.vue'
import materialPlateBundling from './material-plate-bundling.vue'
import optimizeCutting from './optimize-cutting.vue'
import assignDevices from './assign-devices.vue'
import assignTeam from './assign-team.vue'
import print from './print.vue'

export default {
  name: "",
  components: {
    mergeDiagram,
    materialPlateBundling,
    optimizeCutting,
    assignDevices,
    assignTeam,
    print
  },
  props: {},
  data() {
    return {
      dialogVisible: false,
      title: "",
      active: 0
    };
  },
  filters: {},
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  beforeDestroy() {},
  methods: {
    add() {
      this.dialogVisible = true;
      this.active = 0
      this.title = "生成加工单";
      this.$nextTick(function () {
        this.$refs.mergeDiagram.reset()
      });
    },
    previousStep() {
      this.active--
      console.log(this.active, '上一步')
    },
    nextStep() {
      // 合并简图
      if (this.active === 0) {
        this.$refs.mergeDiagram.deliveryData()
      }
      // 料牌分捆
      if (this.active === 1) {
        this.$refs.materialPlateBundling.deliveryData()
      }
      // 优化断料
      if (this.active === 2) {
        this.$refs.optimizeCutting.deliveryData()
      }
      // 分配设备
      if (this.active === 3) {
        this.$refs.assignDevices.deliveryData()
      }
      // 分配班组
      if (this.active === 4) {
        this.$refs.assignTeam.deliveryData()
      }
      // 打印
      if (this.active === 5) {
        this.$refs.print.deliveryData()
      }
      this.active++
      console.log(this.active, '下一步')
    },
    // 合并简图
    getMergeDiagramData(data) {
      console.log(data)
    },
    // 料牌分捆
    getMaterialPlateBundlingData(data) {
      console.log(data)
    },
    // 优化断料
    getOptimizeCuttingData(data) {
      console.log(data)
    },
    // 分配设备
    getAssignDevicesData(data) {
      console.log(data)
    },
    // 分配班组
    getAssignTeamData(data) {
      console.log(data)
    },
    // 打印
    getPrintData(data) {
      console.log(data)
    },
    submitForm() {
      this.$refs.print.deliveryData()
      // this.dialogVisible = false;
    },
    handleClose(done) {
      this.$modal
        .confirm("确认关闭？")
        .then((_) => {
          this.dialogVisible = false;
        })
        .catch((_) => {});
    },
  },
};
</script>

<style scoped lang="scss"></style>
